<!--
 * @Author: yanjikun
 * @Date: 2021-06-18 14:10:07
 * @LastEditors: yanjikun
 * @LastEditTime: 2022-06-16 10:45:53
 * @Description: file content
-->
<template>
  <div class="logo">
    <img :src="logo" alt="" :width="32" :height="32" />
    <div class="logo_title">{{ platformName }}</div>
  </div>
</template>

<script lang="ts" setup>
  import { useProjectStore } from '@/store/modules/projectConfig'
  import { computed } from 'vue'
  defineOptions({
    name: 'YLogo',
  })
  const projectStore = useProjectStore()
  const logo = computed(() => projectStore.basicInfo.logo)
  const platformName = computed(() => projectStore.basicInfo.platform ?? '智慧消防监控平台')
</script>

<style scoped lang="less">
  .logo {
    @apply flex items-center overflow-hidden cursor-pointer select-none;

    .logo_title {
      @apply ml-8px font-bold;
      color: var(--ant-primary-color);
      font-size: 20px;
    }
  }
</style>
